<template>
	<view>
		<view style="height: 1px;"></view>
		<view class="uni-flex uni-navs">
			<view class="uni-title">退回原因：</view>
			<view class="uni-message">
				<picker @change="popupChange" :value="index" :range="array" range-key="name">
					<view class="uni-btn">
						<view v-if="statu">{{ conditionName }}</view>
						<view v-else>{{ array[index].name }}</view>
						<image class="uni-img-icon" src="../../static/imgs/a.png" mode=""></image>
					</view>
				</picker>
			</view>
		</view>
		
		<view class="uni-flex uni-navs">
			<view class="uni-title">备注：</view>
			<textarea maxlength="-1" v-model="remark" placeholder="请输入" />
		</view>
		
		<view class="btn" @click="submit()">提交</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderID:'',
				
				// 退回原因
				index: 0,
				array: [
					{ code: '', name: '' },
				],
				conditionName: '请选择', //选择的服务状态name
				statu:true,
				
				remark:''
			}
		},
		onLoad(e) {
			this.orderID = e.id
			this.send()
		},
		methods: {
			// 退回原因
			send(){
				var that = this;
				uni.request({
					url: '/app/wechatApi/getOrderProcess',
					method: 'POST',
					data: {
						code:'backReason'
					},
					header: {
						'Content-type': 'application/x-www-form-urlencoded'
					},
					success: res => {
						if (res.data.code === 200) {
							that.array = res.data.data
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'none'
							});
						}
					},
					error: e => {
						console.log(e);
					}
				});
			},
			// 选择退回原因
			popupChange: function(e) {
				console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
				this.conditionName = this.array[e.target.value].name
				this.statu = false
				console.log(this.conditionName)
			},
			// 提交
			submit(){
				if(this.conditionName=='请选择'){
					uni.showToast({
						title: '请选择退回原因',
						icon: 'none'
					});
					return
				}
				uni.showLoading({
					mask:false
				})
				uni.request({
					url: '/app/wechatApi/wechatOrder/receiptOrder',
					method: 'POST',
					data: {
						openid:uni.getStorageSync('openid'),
						orderId: this.orderID,
						receiptKey:'firstBack',
						firstBackReason:this.conditionName,
						disposeRemark:this.remark
					},
					header: {
						'Content-type': 'application/x-www-form-urlencoded'
					},
					success: res => {
						uni.hideLoading()
						if(res.data.code == 200){
							uni.showToast({
								title: '操作成功!',
								icon: 'none'
							});
							setTimeout(function(){
								uni.navigateBack({
									delta:2
								})
							},1000)
						}else {
							uni.showToast({
								title: res.data.message,
								icon: 'none'
							});
						}
					},
					error: e => {
						console.log(e);
					}
				});
			}
		}
	}
</script>

<style lang="less">
	page{
		background: #FFFFFF;
	}
.uni-navs {
	margin:25upx;
	padding: 20upx;
	
	.uni-title {
		width: 160upx;
		white-space: nowrap;
	}
	
	.uni-message {
		width: 510upx;
		opacity: 0.6;
		border:1px solid #E0E0E0;
		border-radius: 15upx;
		padding: 15upx;
		box-sizing: border-box;
	}
	textarea {
		padding: 15upx;
		font-size: 26upx;
		width: 71%;
		line-height: 150%;
		height: 200upx;
		border: 1px solid #E0E0E0;
		border-radius: 15upx;
	}
}


/* 按钮 */
	.btn{
		color: #FFFFFF;
		text-align: center;
		background: #48E6E7;
		margin:200upx 50upx 0 50upx;
		padding: 10upx 0;
		border-radius: 10upx;
	}
</style>
